<breadcrumbs></breadcrumbs>

<div class="content-container">

    <div ng-show="status=='DONE'">
        <h1><message key="completePasswordReset.done.title"></message></h1>
        <p><message key="completePasswordReset.done.description"></message></p>

        <ul>
            <li>
                <a href="" ng-click="goAuthenticate()">
                    <message key="completePasswordReset.authenticateAction.title"></message>
                </a>
            </li>
        </ul>
    </div>

    <div ng-show="status=='IDLE'">
        <form name="completePasswordResetForm" novalidate="novalidate">

            <label for="new-password-clear"><message key="completePasswordReset.newPasswordClear.title"></message></label>
            <div class="form-control-group" ng-class="deriveFormControlsContainerClasses('newPasswordClear')">
                <input
                        id="new-password-clear"
                        type="password"
                        name="newPasswordClear"
                        valid-password=""
                        autocomplete="off"
                        ng-change="newPasswordsChanged()"
                        ng-required="true"
                        ng-model="completePasswordResetData.newPasswordClear"></input>
                <error-messages key-prefix="completePasswordReset.newPasswordClear" error="completePasswordResetForm.newPasswordClear.$error"></error-messages>
            </div>

            <label for="new-password-clear-repeated"><message key="completePasswordReset.newPasswordClearRepeated.title"></message></label>
            <div class="form-control-group" ng-class="deriveFormControlsContainerClasses('newPasswordClearRepeated')">
                <input
                        id="new-password-clear-repeated"
                        type="password"
                        autocomplete="off"
                        name="newPasswordClearRepeated"
                        ng-change="newPasswordsChanged()"
                        ng-required="true"
                        ng-model="completePasswordResetData.newPasswordClearRepeated"></input>
                <error-messages key-prefix="completePasswordReset.newPasswordClearRepeated" error="completePasswordResetForm.newPasswordClearRepeated.$error"></error-messages>
            </div>

            <label for="captcha-response-input"><message key="completePasswordReset.captchaResponse.title"></message></label>
            <div class="form-control-group" ng-class="deriveFormControlsContainerClasses('captchaResponse')">
                <img style="vertical-align:middle;" ng-src="{{captchaImageUrl}}"></img>
                =
                <input
                        id="captcha-response-input"
                        size="3"
                        type="text"
                        autocomplete="off"
                        name="captchaResponse"
                        ng-required="true"
                        ng-change="captchaResponseDidChange()"
                        ng-model="completePasswordResetData.captchaResponse"></input>
                <error-messages key-prefix="completePasswordReset.captchaResponse" error="completePasswordResetForm.captchaResponse.$error"></error-messages>
            </div>

            <div class="form-action-container">
                <button
                        ng-disabled="completePasswordResetForm.$invalid"
                        ng-click="goResetPassword()"
                        type="submit"
                        class="main-action">
                    <message key="completePasswordReset.action.title"></message>
                </button>
            </div>

        </form>
    </div>
</div>

<div class="footer"></div>
<spinner spin="shouldSpin()"></spinner>

